@import './predef.scss';
@import './input.scss';
@import './hover-indicator.scss';
@import './responsive.scss';
:root{
	height: 100%;
	overflow: hidden;
	--ph-form-radius:2px;
	
	--phx-half:calc(var(--phx) * 0.2);
	--ph-fs-small:calc(var(--phx) * 0.857);
	--ph-4:calc(var(--phx) * 0.2857);
	--ph-5:calc(var(--phx) * 0.3571);
	--ph-8:calc(var(--phx) * 0.5714);
	--ph-10:calc(var(--phx) * 0.7142);
	--ph-15:calc(var(--phx) * 1.071428);
	--ph-20:calc(var(--phx) * 1.4285);
	--ph-30:calc(var(--phx) * 2.142857);
	--ph-form-border:#dfdfdf;

    --bs-font-sans-serif: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
	
	font-family: var(--bs-font-sans-serif);
	color: var(--ph-c);
}
*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	list-style:none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
body{
    -webkit-text-size-adjust: 100%;
    font-size: var(--phx);
    line-height: 1.5;
    font-weight: 400;
    background-color: #fff;
	zoom: 1;
	height: 100%;
	overflow: hidden;
}
select,input,textarea{
	outline: 0;
	font-family: inherit;
	font-size: inherit;
	color:var(--ph-light-color-active);
	line-height: inherit;
	appearance: none;
	&:focus{
		border-bottom-color: #66afe9!important;
		outline: 0;
		// box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
	}
	&:disabled{
		background-color: var(--ph-bg-disabled)!important;
		cursor: default!important;
		color: var(--ph-color-light)!important;
		opacity: .5;
	}
	&::-webkit-input-placeholder{
		color: var(--ph-color-light);
	}
}

.ph-toggle-height{
	transition: height .3s ease;
	backface-visibility:hidden;
	overflow: hidden;
}

.ph-placeholder{
	color: var(--ph-color-light)!important;
}
.ph-primary{
	background-color: var(--ph-primary-bg)!important;
	color:var(--ph-primary-color)!important;
}
.ph-info{
	background-color: var(--ph-info-bg)!important;
	color:var(--ph-info-color)!important;
}
.ph-success{
	background-color: var(--ph-success-bg)!important;
	color:var(--ph-success-color)!important;
}
.ph-warning{
	background-color: var(--ph-warning-bg)!important;
	color:var(--ph-warning-color)!important;
}
.ph-danger{
	background-color: var(--ph-danger-bg)!important;
	color:var(--ph-danger-color)!important;
}


.ph-pointer{
	cursor: pointer;
}
.ph-text-center{
	text-align: center;
}
// .ph-scroll{
// 	&::-webkit-scrollbar{
// 		width: 0!important;
// 	}
// }